/**
*   @desc:  TabBar Object
*   @param: parentObject - parent html object or id of parent html object
*   @param: mode - tabbar mode - top.bottom,left,right; top is default
*   @param: height - height of tab (basis size)
*   @type: public
*   @topic: 0
*/
function dhtmlXTabBar(parentObject,mode,height){
	mode=mode||"top"
	dhtmlxEventable(this);
	
	this._hrefs = {}; //compatibility with 2.0
	this._s={};
	this._c={};
	this.tabTitleLeft=0;
	this._s.mode=mode;
	this._s.scrolls=true;
	this._s.line_height=(parseInt(height)||20)+3;//+3 to be compatible with 1.x sizes 
	this._s.skin_line = 1;
	this._s.tab_margin = 0;
	this._s.expand = 1;		//默认值为0,2010-12-7改为1，作用于setSize方法中的设置内容区的width.为0时width会自动减2,没有必要，所以改成1
	this._s.ext_border = 2;
	this._s.increment=2;
	this._s._bMode=(mode=="right"||mode=="bottom")?1:0;
	this._s._vMode=(mode=="right"||mode=="left")?1:0;
	
	this._dx=this._s._vMode?"height":"width";
	this._dy=this._s._vMode?"width":"height";
	
	switch(mode){
		case "top":
			this._py="top"; this._px="left"; this._pxc="right";
		break;
		case "bottom":
			this._py="bottom"; this._px="left"; this._pxc="right";
		break;
		case "right":
			this._py="right"; this._px="top"; this._pxc="bottom";
		break;
		case "left":
			this._py="left"; this._px="top"; this._pxc="bottom";
		break;
	}
	
	
	this._active= null;
    this._tabs = {};
    this._content = {};
    this._href={}
	this._rows=[];
	
	this._s._tabSize=150;
	
	this._styles={
		"default":{ left:3, right:3, select_shift:3, select_top:2, margin:1, offset:5, tab_color:"", data_color:"" },
		"winbiscarf":{ left:18, right:18, select_shift:3, select_top:2, margin:1, offset:5},
		"winscarf":{ left:18, right:4, select_shift:3, select_top:2, margin:5, offset:5},
		"modern":{ left:5, right:5, select_shift:3, select_top:2, margin:1, offset:5, tab_color:"", data_color:"" },
		"silver":{ left:7, right:7, select_shift:3, select_top:2, margin:1, offset:5, tab_color:"", data_color:"" },
		"dark_blue":{ left:2, right:2, select_shift:3, select_top:2, margin:1, offset:5 },
		"glassy_blue":{ left:7, right:7, select_shift:0, select_top:1, margin:0, offset:5 },
		
		"dhx_black":{ left:2, right:2, select_shift:3, select_top:0, margin:1, offset:5},
		"dhx_blue":{ left:2, right:2, select_shift:3, select_top:0, margin:1, offset:5, tab_color:"", data_color:"" },
		"dhx_skyblue":{ left:3, right:3, select_shift:0, select_top:0, margin:-1, offset:0 , data_color:"", hover:true },
		"dhx_web":{ left:3, right:3, select_shift:1, select_top:0, margin:5, offset:15 , data_color:"" }
	};
	
	if (typeof(parentObject)!="object")
            parentObject = document.getElementById(parentObject);
    this.entBox=parentObject;
    this.entBox.className+=" dhx_tabbar_zone_"+this._s.mode;
	if (dhtmlx.image_path) this.setImagePath(dhtmlx.image_path);
	
	this.setStyle("default"); this.__skin = false;
    this._createSelf();            //generate TabBar DOM structure

    if (_isIE) this.preventIECashing(true);
    return this;
}

dhtmlXTabBar.prototype={
	_get_size:function(name,alter){
		var size = this.entBox.getAttribute(name) || this.entBox.style[name] || (window.getComputedStyle?window.getComputedStyle(this.entBox,null)[name]:(this.entBox.currentStyle?this.entBox.currentStyle[name]:0))
		if ((size||"").indexOf("%")!=-1)
			this.enableAutoReSize(true,true);
		if (!size||size.indexOf("%")!=-1||size=="auto")
			size=alter+"px";
		return size;
	},
	
	setStyle:function(name){
		this.setSkin(name);
	},
	_getSkin:function(tab){
		//if (tab && tab.skin) return this._styles[tab.skin];
		return this._a;
	},
/**
*     @desc: set style used for tabbar
*     @type: public
*     @param: name - any valid style name
*     @topic: 0
*/	
	setSkin:function(name){
		name=name.toLowerCase();
		if (!this._styles[name]) name="default";
		this._a=this._styles[name];
		this.skin=name;
		if (this._tabAll)
			this._tabAll.className='dhx_tabbar_zone dhx_tabbar_zone_'+this.skin;
		if(this._tabTitle){
			this._tabTitle.className="mid_top_"+this.skin;
		}
		var sky_mode = name.indexOf("dhx_sky")==0;
		var simple_mode = name.indexOf("dhx_web")==0;
		if (sky_mode) 
			this._s.skin_line=0;
		if (simple_mode){
			this._s.line_height = 29;
			this._s.ext_border = -1;
			this._s.expand = true;
		}
		if (sky_mode) {
			this._s.line_height=32;
			this._setRowSizes();

				
			this._s.skin_line_x=true;
			this._s.skin_line=-3;
			var r = this._s._rendered;
			if (r) for (var i=0; i < r.length; i++) {
				r[i].parentNode.removeChild(r[i]);
			}
				
//			var d1 = document.createElement("DIV");
//			d1.className="dhx_tabbar_lineA";
//			this._tabAll.appendChild(d1);
//			var d2 = document.createElement("DIV");
//			d2.className="dhx_tabbar_lineB";
//			this._tabAll.appendChild(d2);
//			
//			var d3 = document.createElement("DIV");
//			d3.className="dhx_tabbar_lineC";
//			this._tabAll.appendChild(d3);
//			
//			var d4 = document.createElement("DIV");
//			d4.className="dhx_tabbar_lineD";
//			this._tabAll.appendChild(d4);
		
			this._getCoverLine();
//			this._s._rendered = [d1,d2,d3,d4];
					
			if (this._s.expand){
				this._conZone.style.borderWidth="0px 0px 0px 0px";
				this._tabZone.firstChild.style.borderWidth="0px 0px 0px 0px";
//				d3.style.borderWidth="0px 0px 0px 0px";
//				d4.style.left="0px";
//				d3.style.right="0px";
//				d1.style.borderWidth="0px 0px 0px 0px";
				if (this._s.mode=="top")
					this._lineA.style.borderWidth="1px 0px 0px 0px";
				
//				d2.style.left = "1px"
			}
					
			var f = function(){
				this._lineA.style[this._dx]="1px"; 
				var _quirks=(_isIE && document.compatMode == "BackCompat");
				var w = this._tabAll[this._s._vMode?"offsetHeight":"offsetWidth"]+(_quirks?2:0);
				if (this._lastActive)
					w=Math.max(w,this._lastActive.parentNode[this._s._vMode?"scrollHeight":"scrollWidth"]);
				if (w<6) return;
				
//				d1.style[this._py]=parseInt(this._conZone.style[this._py])-3+"px"; 
//				d1.style[this._dx]=w-2+"px"; 
//				
//				d2.style[this._py]=parseInt(this._conZone.style[this._py])-3+"px"; 
//				d2.style[this._dx]=w-(_quirks?6:4)+(this._s.expand?2:0)+"px"; 
//				
//				d3.style[this._dy]=parseInt(this._tabZone.style[this._dy])-3+"px"; 
				this._lineA.style[this._dx]=w-2-this.tabTitleLeft+"px"; 
			}

			f.call(this);
			var bf = this._checkScroll;
			this._checkScroll=function(){
				f.apply(this,arguments);
				bf.apply(this,arguments);
			}
			var bs = this._scrollTo;
			this._scrollTo=function(){
				bs.apply(this,arguments);
				f.apply(this,arguments);
			}
			/*var bf2=this.addTab;
			this.addTab=function(){
				bf2.apply(this,arguments);
				f.apply(this,arguments);
			}*/
		}
		if (this._a.data_color && this._conZone)
			this._conZone.style.backgroundColor=this._a.data_color;
		this.__skin = true;
		
		switch(name)
		{
			case "glassy_blue":
				this._s._tabSize = "auto";			//设置tab宽度
				this._s.line_height = 32;
				this._s.increment = -7;
			  //this.tabCnt.setSkinColors("#FCFBFC","#F4F3EE");
			  this.enableForceHiding(true);
				this.enableAutoReSize(false);
				this.enableTabCloseButton(false);
				//this.contentPadding = "8px 8px 8px 8px";
			break;
		}

		
	},
/**
*     @desc: enable / disable auto adjusting height and width   to outer conteiner
*     @type: public
*     @param: mode - enable/disable
*     @topic: 0
*/
	
	enableAutoReSize:function(){
		var self=this;
		dhtmlxEvent(window,"resize",function(){
			window.setTimeout(function(){
				if (self && self._setSizes)
					self._setSizes();
			},1)		
		})
	},
	setHome : function(html){
		this._tabHome.innerHTML = html;
	},
	_createSelf:function(){
        this._tabAll=document.createElement("DIV");
        this._tabZone=document.createElement("DIV");
        this._conZone=document.createElement("DIV");
        this._tabTitle = document.createElement("DIV");
		this._tabHome = document.createElement("DIV");

		this._tabTitle.className="mid_top_"+this.skin;
		this._tabHome.className="home";
		this._tabTitle.appendChild(this._tabHome);
		this._tabTitle.appendChild(this._tabZone);

        this.entBox.appendChild(this._tabAll);
        this._tabAll.appendChild(this._tabTitle);
		this._tabAll.appendChild(this._conZone);
        	
        this._tabAll.className='dhx_tabbar_zone dhx_tabbar_zone_'+this.skin;
        if (this._s._vMode)
        	this._tabAll.className+='V';
        if (this._s._bMode)
            this._tabAll.className+='B';
        this._tabZone.className='dhx_tablist_zone';
        this._conZone.className='dhx_tabcontent_zone';
        if (this._a.data_color)
        	this._conZone.style.backgroundColor=this._a.data_color;

        this._tabZone.onselectstart = function(){ return false; };
        this._tabZone.onclick = this._onClickHandler;
        this._tabZone.onmouseover = this._onMouseOverHandler;
        this._tabZone[_isFF?"onmouseout":"onmouseleave"] = this._onMouseOutHandler;    
        this._tabZone.tabbar=this;

        this._createRow();
	},
	_createRow:function(){
		var z=document.createElement("DIV");
    	z.className='dhx_tabbar_row';
    	z.tabCount=0;
    	this._tabZone.appendChild(z);
		this._rows[this._rows.length]=z;

        this._setRowSizes();
	},
	_removeRow:function(row){
    	row.parentNode.removeChild(row);
    	var z=[];
    	for (var i=0; i<this._rows.length; i++)
        	if (this._rows[i]!=row) z[z.length]=this._rows[i];
	    this._rows=z;
	},
	_setSizes:function(x,y){
		var dim=["clientHeight","clientWidth"];
		if (this._dx!="width") dim.reverse();
		
		var _quirks=(_isIE && document.compatMode == "BackCompat");
		var outerBorder=(this._conZone.offsetWidth-this._conZone.clientWidth);		
		
		var _h=y||(this.entBox[dim[0]]+(_quirks?outerBorder:0));
		var _w=x||(this.entBox[dim[1]]+(_quirks?outerBorder:0));
		var _t=this._rows.length*(this._s.line_height-(this._s.skin_line_x?4:2))+(this._s.skin_line_x?4:2);
		this._tabZone.style[this._dy]=this._s.line_height+this._s.increment+"px";
		this._conZone.style[this._dy]=Math.max(0,_h-this._s.ext_border-_t/*-(this._s.skin_line_x?3:0)*/-this._s.tab_margin)+"px";		
		if(jQuery.browser.msie && jQuery.browser.version.indexOf("6")>=0){
			this._conZone.style[this._dx]=Math.max(0,_w - (this._s.expand?0:2))+"px";
		}else{
			 this._conZone.style[this._dx]="100%";//Math.max(0,_w - (this._s.expand?0:2))+"px";
		}
		//this._tabZone.style[this._py]=_t+"px";
		this._tabZone.style[this._py]=this._s.tab_margin+"px";
		this._conZone.style[this._py]=_t+this._s.tab_margin-this._s.skin_line-1+"px";
		this._checkScroll();
		
		var id = this.getActiveTab();		
		if (id)	this.cells(id).activate();
		/*for (var id in this._content)
			if (this._content[id])
				this._content[id].adjustContent(this._content[id].parentNode,0,0,false,0);
				*/
	},
	_checkScroll:function(){
		if (this._s._vMode || !this._s.scrolls) return; //only x-scrolls
		for (var i=0; i<this._rows.length; i++){
			if ((this._rows[i].scrollWidth-this._rows[i].offsetWidth)>2)
				this._showScroll(i);
			else this._hideScroll(i);
		}
	},
	_showScroll:function(i){
		if (this._rows[i]._scroll) return;
		var a=this._rows[i]._scroll=[];
		var top = Math.max(0,this._s.line_height-23);
		a[0]=document.createElement("DIV");
		a[0].style.cssText="background-image:url("+this.imgUrl+this.skin+"/"+this.skin+"_scroll_left.gif); width:20px; height:21px;position:absolute;left:0px;z-index:990;top:"+top+"px;";
		a[0].className="dhx_tab_scroll_left";
		this._rows[i].appendChild(a[0]);
		
		a[1]=document.createElement("DIV");
		a[1].style.cssText="background-image:url("+this.imgUrl+this.skin+"/"+this.skin+"_scroll_right.gif); width:20px; height:21px;position:absolute;right:0px;z-index:990;top:"+top+"px;";
		a[1].className="dhx_tab_scroll_right";
		this._rows[i].appendChild(a[1]);
	},
	_hideScroll:function(i){
		if (!this._rows[i]._scroll) return;
		this._rows[i].removeChild(this._rows[i]._scroll[0])
		this._rows[i].removeChild(this._rows[i]._scroll[1])
		this._rows[i]._scroll=null;
	},

	_setRowSizes:function(){
		for (var i=0; i<this._rows.length; i++){
			this._rows[i].style[this._dy]=this._s.line_height+this._s.increment+"px";
			//this._rows[i].style[this._py]="6px";//i*(this._s.line_height-(this._s.skin_line_x?4:2))-((_isIE && !window.postMessage && this._s._bMode)?0:0)+"px";	//dirty!
			this._rows[i].style.zIndex=10+i;
		}
		this._setSizes();
	},
	_setTabSizes:function(row){
		var pos=this._a.offset;
		var px = this._vMode?this._pxc:this._px;
		for (var i=0; i < row.tabCount; i++) {
			var tab=row.childNodes[i];
			if (tab.style.display=="none") continue;
			tab.style[px]=pos-(this._lastActive==tab?this._a.select_shift:0)+"px";
			pos+=tab._size+this._a.margin;
		}
	},
/**
*   @desc: add tab to TabBar
*   @param: id - tab id
*   @param: text - tab content
*   @param: size - width(height) of tab
*   @param: position - tab index , optional
*   @param: row - index of row, optional  [only in PRO version]
*   @type: public
*   @topic: 1
*/
	
	addTab:function(id, text, size, position, row){  
		if (!this.__skin && dhtmlx.skin) this.setSkin(dhtmlx.skin);
		row=row||0;

		var z=this._rows[row].tabCount;
    	if ((!position)&&(position!==0)) position=z;

	    var tab=this._createTab(id, text, (size=="*"?10:size||this._s._tabSize));
		this._addTab(this._rows[row],tab,size||this._s._tabSize,position);
		this._tabs[id]=tab;
		this.cells(id).hide();
		this._checkScroll();
		tab.onclick = this._bind(function(){this.callEvent("onTabClick",[id,tab]); },this) 
			
		this.callEvent("onTabAdded",[id]); 
		return tab;
	},
	
	_bind: function(fun,tObj) 
	{
	    return function() {
	    	return fun.call(tObj);
	    }
	},	
/**
*   @desc: remove tab from tabbar
*   @param: tab - id of tab
*   @param: mode - if set to true, selection jump from current tab to nearest one
*   @type: public
*   @topic: 1
*/
	
	removeTab:function(id,mode){
	    var tab=this._tabs[id];
    	if (!tab) return;
		this.cells(id)._dhxContDestruct();
		if (this._content[id] && this._content[id].parentNode)
			this._content[id].parentNode.removeChild(this._content[id]);
		this._content[id]=null;
		
		this._goToAny(tab,mode);

	    var row=tab.parentNode;
    	row.removeChild(tab);
    	row.tabCount--;
    	
    	if ((row.tabCount==0)&&(this._rows.length>1))
        	this._removeRow(row);
        else
        	this._setTabSizes(row);
        	
    	delete this._tabs[id];
    	if (this._lastActive==tab) this._lastActive=null;
	    this._setRowSizes();	
	    //为了处理关闭tabbar后，存在滚动条时最后一个tabbar不能紧靠右边。
		var lastTab =this._rows[0].childNodes[this._rows[0].tabCount-1];
	    if(this._rows[0].scrollWidth>(lastTab.offsetWidth+lastTab.offsetLeft)){
	    	var scLeft=parseInt(this._rows[0].scrollLeft)-(this._rows[0].scrollWidth-lastTab.offsetWidth-lastTab.offsetLeft);
			this._rows[0].scrollLeft=scLeft;
			var tag = this._rows[0]._scroll;
			if (tag && tag[0]){
				tag[0].style.left=scLeft+"px";
				if (!_isIE || window.XMLHttpRequest)
	    			tag[1].style.right=scLeft*(-1)+"px";
			}
		}
		this.callEvent("onTabRemoved",[id]); 
	},
	getLastTab:function(){
		return this._rows[0].childNodes[this._rows[0].tabCount-1];
	},
	_goToAny:function(tab,mode){
    	if (this._lastActive==tab){
    		
        	if (mode && this.goToNextTab()==tab)
        		this.goToPrevTab();
        	if (this._lastActive==tab)
        		this._lastActive=null;
    	}
	},
	_createTab:function(id,text,size){
 		var tab=document.createElement("DIV");
    	tab.className='dhx_tab_element dhx_tab_element_inactive';
    	var thml="<span>"+text+"</span><div></div><div></div><div></div>";
    	if (this._close)// thml+="<IMG style='"+this._pxc+":1px; "+this._py+":0; position:absolute;z-index:11;' src='"+this.imgUrl+this.skin+"/close.png' >"
    	thml+="<a href='#' class='link_close'></a>";
    	tab.innerHTML=thml;
    	
    	tab.setAttribute("tab_id",id);
    	tab.setAttribute("tab_title",text);

			isNaN(parseInt(size))?size=0:size;
    	tab._size=parseInt(size);
    	tab.style[this._dx]=parseInt(size)+"px";
    	tab.style[this._dy]=this._s.line_height+this._s.increment+"px";
    	tab.style[this._py]=this._a.select_top+"px";
    	tab.skin=this.skin;
    	if (this._a.tab_color)
    		tab.style.backgroundColor=this._a.tab_color;
//    	if (this._c[id])
//        	tab.childNodes[0].style.cssText=this._c[id].color;
        	
    	this._img_all(tab);
    	if (this._close){
    		var self=this;
    		tab.childNodes[4].onclick=function(e){ var id=this.parentNode.getAttribute("tab_id"); if (self.callEvent("onTabClose",[id])) self.removeTab(id,true); (e||event).cancelBubble=true; };
    	}
    	return tab;				
	},
	_img_all:function(tab){
		var a=this._getSkin(tab);
		var pf=tab._active?1:4;
		//this._img(tab,pf+"_middle");
    	this._img(tab.childNodes[1],pf,this._px,a.left);
    	this._img(tab.childNodes[2],pf+2,this._pxc,a.right);
    	this._img(tab.childNodes[3],pf+1,this._px,parseInt(tab.style[this._dx])-(a.left+a.right),a.left);
    	//清除二级标签最后一根竖线
		if(this.skin=="dhx_blue"){
			for(var i=this._rows[0].childNodes.length-1;i>=0;i--){
				if(jQuery(this._rows[0].childNodes[i]).hasClass("dhx_tab_element")){
					this._rows[0].childNodes[i].childNodes[2].style.backgroundImage=
					"url("+this.imgUrl+this.skin+"/"+this.skin+"_"+this._s.mode+".gif)";
				}
			}
			if(this._rows[0].tabCount>1&&this._rows[0].childNodes[this._rows[0].tabCount-1])
				this._rows[0].childNodes[this._rows[0].tabCount-1].childNodes[2].style.backgroundImage="";
		}//结束--清除二级标签最后一根竖线
    	//ff3.0 thinks that 2==3, waiting for 3.5 
    	//tab.childNodes[1].style.backgroundRepeat="no-repeat";
	},
	_get_img_pos:function(ind){
		if (this._s._bMode && ind<7) ind=Math.abs(ind-6);
		ind=-5-ind*45;
		if (this._s._vMode) return ind+"px 0px";
		else return "0px "+ind+"px";
		
	},
	_img:function(tag,y,pos,a,b){
		tag.style.backgroundImage="url("+this.imgUrl+this.skin+"/"+this.skin+"_"+this._s.mode+".gif)";
		tag.style.backgroundPosition=this._get_img_pos(y);
		tag.style[this._py]="0px";
		if (pos){
			tag.style[this._dx]=Math.max(a,0)+"px";
			tag.style[pos]=(b||0)+"px";
		}
		//tag.style.backgroundPosition=this._px+" "+this._py;
	},
	_addTab:function(row,tab,size,position){
		var pos=this._a.offset;
		if (row.tabCount){
			var last=row.childNodes[row.tabCount-1];
			var pos=parseInt(last.style[this._s.align?this._pxc:this._px])+parseInt(last._size)+this._a.margin;
		}
		
		var next=row.childNodes[position];
		if (next)
			row.insertBefore(tab,next)
		else
			row.appendChild(tab);
		row.tabCount++;		
		if (size=="*"){
			tab.style.whiteSpace="nowrap";
			this.adjustTabSize(tab);
		}
		

		if (size=="auto")
		{
			this.adjustTabSize(tab,jQuery(tab).find("span").prop("offsetWidth")+32);
		}
		
		tab.style[this._s.align?this._pxc:this._px]=pos+"px";
		if (position!=row.tabCount-1) this._setTabSizes(row);
	},
	adjustTabSize:function(tab,size){
		var a=this._getSkin(a);
		if (!size){
			tab.style.fontWeight="bold";
			tab.childNodes[3].style[this._dx] = tab.style[this._dx]="10px";
			size=tab[this._s._vMode?"scrollHeight":"scrollWidth"]+10+(this._close?20:0);
			tab.style.fontWeight="";
		}
		tab.style[this._dx]=size+"px";
		tab._size=size;
		
		this._img_all(tab);
	},
	_onMouseOverHandler:function(e){
		var target = this.tabbar._getTabTarget(e?e.target:event.srcElement);
        this.tabbar._showHover(target);
	},
	_onMouseOutHandler:function(e){
    	this.tabbar._showHover();
    	for(var i in this.tabbar._tabs){
    		if(this.tabbar._tabs[i].childNodes[4]){
    			this.tabbar._tabs[i].childNodes[4].style.display="none";
    		}
    	}
	},
	_showHover:function(tab){
		if(tab){
			if(tab.childNodes[4])tab.childNodes[4].style.display="block";
		}
		if (tab==this._lastHower) return;
		if (this._lastHower && this._lastHower != this._lastActive){
			var a=this._getSkin(this._lastHower);
			this._lastHower.className=this._lastHower.className.replace(/[ ]*dhx_tab_hover/gi,"");
			
			if (a.hover)
				this._img_all(this._lastHower);
			else
				this._img(this._lastHower.childNodes[3],5,this._px,parseInt(this._lastHower.style[this._dx])-(a.left+a.right),a.left);
			//this._lastHower.style.zIndex=this._getCoverLine()._index-2;
			this._lastHower=null;
			
		}

		if (tab && ( tab == this._lastActive || tab._disabled)) return;
		
		this._lastHower=tab;	
		if(tab){
			var a=this._getSkin(tab);
			tab.className+=" dhx_tab_hover";
			if (a.hover){
	    		this._img(tab.childNodes[1],7,this._px,a.left);
    			this._img(tab.childNodes[2],8,this._pxc,a.right);
			}
			this._img(tab.childNodes[3],0,this._px,parseInt(tab.style[this._dx])-(a.left+a.right),a.left);
			//tab.style.zIndex=this._getCoverLine()._index-1;
		}
		
    },
    _getTabTarget:function(t){
		if (!t) return null;
    	while ((!t.className)||(t.className.indexOf("dhx_tab_element")==-1)){
        	if ((t.className)&&(t.className.indexOf("dhx_tabbar_zone")!=-1)) return null;
        	t=t.parentNode;
        	if (!t) return null;
        }
    	return t;
	},
	_onClickHandler:function(e){
		var src=e?e.target:event.srcElement;
        var target = this.tabbar._getTabTarget(src);
        if (target && !target._disabled)
	        this.tabbar._setTabActive(target);
	    else {
	    	var tag=null;
	    	if (src.className=="dhx_tab_scroll_left"){
	    		src.parentNode.scrollLeft=Math.max(0,src.parentNode.scrollLeft-src.parentNode.offsetWidth/2);
	    		tag=src;
	    		this.tabbar._setTabTop(this.tabbar._lastActive);
    		}
	    	else if (src.className=="dhx_tab_scroll_right"){
	    		src.parentNode.scrollLeft+=src.parentNode.offsetWidth/2;
	    		tag=src.previousSibling;
	    		this.tabbar._setTabTop(this.tabbar._lastActive);
    		}
    		if (tag){
				tag.style.left=tag.parentNode.scrollLeft+"px";
				if (!_isIE || window.XMLHttpRequest)
					tag.nextSibling.style.right=tag.parentNode.scrollLeft*(-1)+"px";
    			return false;
			}
	    }
	},
	_deactivateTab:function(){
		this._setTabInActive(this._lastActive);
		this._lastActive=null;
	},
	_setTabInActive:function(tab,mode){ 
		if (!tab || tab!=this._lastActive) return true;
		var a = this._getSkin(tab);
		var id = tab.getAttribute("tab_id");
		var px = this._s.align?this._pxc:this._px;
		
		tab.className=tab.className.replace("_active","_inactive");
		tab.style[this._py]=a.select_top+"px";
		tab.style[px]=parseInt(tab.style[px])+a.select_shift+"px";
	    tab.style[this._dx]=tab._size+"px";
	    
		tab._active=false;
		if (a.tab_color)
        	tab.style.backgroundColor=a.tab_color;
//        if (this._c[id])
//        	tab.childNodes[0].style.cssText=this._c[id].color;
        	
		this._img_all(tab);
		
		this.cells(id).hide();
	},
	_setTabActive:function(tab,mode){ 
		if (!tab || tab==this._lastActive) return true;
		var id = tab.getAttribute("tab_id");
		var last_id = this._lastActive?this._lastActive.getAttribute("tab_id"):null;
		var a = this._getSkin(tab);
		
		if (!mode)
			if (!this.callEvent("onSelect",[id,last_id])) return;
		
		var px = this._s.align?this._pxc:this._px;
		this._setTabInActive(this._lastActive);
	    tab.className=tab.className.replace("_inactive","_active");
	    tab.style[this._py]=this._a.select_top+"px";
	    tab.style[px]=parseInt(tab.style[px])-a.select_shift+"px";
	    tab.style[this._dx]=tab._size+a.select_shift*2+"px";
	    
        tab._active=true;
        if (a.data_color)
        	tab.style.backgroundColor=a.data_color;
//        if (this._c[id])
//        	tab.childNodes[0].style.cssText=this._c[id].scolor;
        	
    	//this._setContent(tab);    
    	this._img_all(tab);
	    this._setTabTop(tab);
	    if(this._lastActive&&this._lastActive.childNodes[4]){this._lastActive.childNodes[4].className="link_close";}
	    if(this._lastActive&&this._lastActive.getAttribute("tab_id")=="mainTabPanel"){
	    	this._lastActive.childNodes[0].childNodes[0].className="home_ico_link";
	    }
	    this._lastActive=tab;
	    if(tab.childNodes[4]){tab.childNodes[4].style.display="none";tab.childNodes[4].className="active_close";}
	    if(tab.getAttribute("tab_id")=="mainTabPanel"){
	    	tab.childNodes[0].childNodes[0].className="home_ico";
	    	tab.childNodes[1].style.height="32px";
	    	tab.childNodes[2].style.height="32px";
	    	tab.childNodes[3].style.height="32px";
	    }else{
	    	if(this.getTab("mainTabPanel")){
	    		this.getTab("mainTabPanel").childNodes[1].style.height="28px";
	    		this.getTab("mainTabPanel").childNodes[2].style.height="28px";
	    		this.getTab("mainTabPanel").childNodes[3].style.height="28px";
	    	}
	    }
	    this.cells(id).show();
	    this._scrollTo(tab);
	    if (!this.callEvent("onTabActive",[id,last_id])) return;
	    return true;
	},
	_scrollTo:function(tab){
		if (!this._s.scrolls) return;
		if (tab.offsetLeft<tab.parentNode.scrollLeft || (tab.offsetLeft+tab.offsetWidth)>(tab.parentNode.scrollLeft+tab.parentNode.offsetWidth)){
			tab.parentNode.scrollLeft = tab.offsetLeft;
			var tag = tab.parentNode._scroll;
			if (tag && tag[0]){
				tag[0].style.left=tag[0].parentNode.scrollLeft+"px";
				if (!_isIE || window.XMLHttpRequest)
	    			tag[1].style.right=tag[1].parentNode.scrollLeft*(-1)+"px";
			}
		}
	},
	_setTabTop:function(tab){
		var t = this._rows.length-1;
	    for (var i=0; i<this._rows.length; i++)
	        if (this._rows[i]==tab.parentNode){
	        	var row=this._rows[i];
	        	if (i!=t){
	        		this._rows[i]=this._rows[t]
	        		this._rows[t]=row;
    	    	}
    	    	var line=this._getCoverLine();
    	    	row.appendChild(line);
    	    	line.style[this._dx]="1px";
    	    	
    	    	var wh=(this._s._vMode?Math.max(this._tabZone.offsetHeight,row.scrollHeight):Math.max(this._tabZone.offsetWidth,row.scrollWidth));
    	    	if (wh>0)
    				line.style[this._dx]=wh+"px";
    	    	tab.style.zIndex=(line._index++);
    	    	break;
	    	}
		this._setRowSizes();
	},
	_getCoverLine:function(){
		if (!this._lineA){
			this._lineA=document.createElement("div");
        	this._lineA.className="dhx_tablist_line";
        	this._lineA.style[this._py]=this._s.line_height-3-(this._s.skin_line_x?1:0)+"px";
        	this._lineA.style[this._dx]="100%";
        	this._lineA._index=1;
		}
		this._lineA.style.zIndex=(this._lineA._index++);
		
		return this._lineA;
	},
	cells:function(id){
		if (!this._tabs[id]) return null;
		if (!this._content[id]){
			var d=document.createElement("DIV");
			d.style.cssText="width:100%;height:100%;visibility:hidden;overflow:hidden;position:absolute;top:0px; left:0px;";
			d.setAttribute("tab_id",id);
			d.skin = this.skin;
			this._conZone.appendChild(d);
			(new dhtmlXContainer(d)).setContent(d);
			if (this.skin=="dhx_web" && d._setPadding) d._setPadding(1, "dhxcont_tabbar_dhx_web"); // for headerless cell use d._setPadding(0, "");
			
			this._content[id]=d;
			if (this.contentPadding)
				d.mainCont.def.style.padding=this.contentPadding;
			var self=this; //can cause memory leak
			d.show = function(){ 
				if (self._s.hide)
					this.style.display="";
				this.style.visibility="";
				this.style.zIndex="1";
				this.autoSize();
				this._activate();
				if(!(jQuery.browser.msie && jQuery.browser.version.indexOf("6")>=0)){
					this.style.width = "100%";
					this.style.height = "100%";
					this.childNodes[0].style.width = "100%";
					this.childNodes[0].style.height = "100%";
				}
			}
			d.hide = function(){
				if (self._s.hide){
					this.style.visibility="";
					this.style.display="none";
				} else
					this.style.visibility="hidden";
				this.style.zIndex=-1;
				if (self._hrfmode=="iframe") this.attachURL("javascript:false");
			}
			d.autoSize = function(){
				if (self._awdj || self._ahdj){
					if (!this.mainCont.offsetWidth)
						this.mainCont.style.width=Math.max(0,self.entBox.offsetWidth - 2)+"px";
					if (self._ahdj)
						this.mainCont.style.height="1px";
						
					var dim = this._getContentDim();
					if (self._awdj){
						self.entBox.style.width=dim[0]+2+"px";
						this.mainCont.style.width=dim[0]+"px";
					}
					if (self._ahdj){
						self._tabAll.style.height = self.entBox.style.height=dim[1]+self._rows.length*(self._s.line_height-2)+(self._s.expand?0:2)+2+"px";
						this.mainCont.style.height=dim[1]+"px";
					}
					self._setSizes();
					self._setTabTop(self._lastActive);
				}
			}
			d._activate=function(){
				if (this._delay) 
					this._attachContent.apply(this,this._delay);
				this.activate();
				if (self._hrfmode!="iframe") 
					this._delay=null;
			};
			d.activate=function(){
				//this.adjustContent(this.parentNode,0,0,false,0);
				d.updateNestedObjects();
			}
			d._doOnAttachStatusBar = d.activate;
			d._doOnAttachMenu = d.activate;
			d._doOnAttachToolbar = d.activate;			
			d._getContentDim=function(){
				return [this.mainCont.scrollWidth,this.mainCont.scrollHeight];
			}
			d._doOnFrameContentLoaded=function(){
				if (self._awdj || self._ahdj)
					self.cells(id).autoSize();				
				self.callEvent("onXLE",[]);
				self.callEvent("onTabContentLoaded",[this.getAttribute("tab_id")]);
			}
			d._doOnBeforeAttachURL=function(){
				self.callEvent("onXLS",[]);
			}
			d.adjustContent(d.parentNode,0,0,false,0);
		}
		return this._content[id];
	},
/**
*     @desc: forcing to load tab in question
*     @type: public
*     @param: tabId - id of tab in question
*     @param: href - new href, optional
*     @topic: 0
*/
	
	forceLoad:function(id,href){
        this.setContentHref(id,href||this._hrefs[id]);
        this.cells(id)._activate();
	},
	
	
	
/**
*     @desc: enable disable auto adjusting height and width   to inner content
*     @type: public
*     @param: autoWidth - enable/disable auto adjusting width
*     @param: autoHeight - enable/disable auto adjusting height
*     @topic: 0
*/
	
	enableAutoSize:function(autoWidth,autoHeight){
	    this._ahdj=convertStringToBoolean(autoHeight);
	    this._awdj=convertStringToBoolean(autoWidth);
	},
	
/**
*   @desc: reinitialize  tabbar
*   @type: public
*   @topic: 0
*/
	
	clearAll:function(){ return;
		for (var id in this._tabs)
			this.removeTab(id,false);
		if (this._lineA){
			var line=this._getCoverLine();
			if (line.parentNode) line.parentNode.removeChild(line);
		}
	},
/**
*   @desc: enable mode, in which each tab has close button, mode will be applied to the tabs created AFTER command
*   @param: bool - false/true - enable/disable
*   @type: public
*   @topic: 1
*/
	
	enableTabCloseButton:function(mode){
		this._close = convertStringToBoolean(mode);
	},	
	
	
	preventIECashing:function(mode){
    	this.no_cashe = convertStringToBoolean(mode);
    	if (this.XMLLoader) this.XMLLoader.rSeed=this.no_cashe;
	},
/**
*   @desc: switch tab to active state
*   @param: tabId - id of tab
*	@param: mode - if to run onSelect handler (true by default)
*   @type: public
*   @topic: 1
*/
	
	setTabActive:function(id,mode){
		this._setTabActive(this._tabs[id],mode===false);
	},
	setTabInActive:function(){
		var tab = this._lastActive;
		if (tab){
			this._deactivateTab();
			this._setTabTop(tab);
			this._getCoverLine();
		}
	},
/**
*     @desc: load tabbar from xml string
*     @type: public
*     @param: xmlString - XML string
*     @param: afterCall - function which will be called after xml loading
*     @topic: 0
*/
	
	loadXMLString:function(xmlString,call){
       	this.XMLLoader=new dtmlXMLLoaderObject(this._parseXML,this,true,this.no_cashe);
        this.XMLLoader.waitCall=call||0;
    	this.XMLLoader.loadXMLString(xmlString);
	},
/**
*     @desc: load tabbar from xml file
*     @type: public
*     @param: file - link too XML file
*     @param: afterCall - function which will be called after xml loading
*     @topic: 0
*/
	
	loadXML:function(url,call){
		this.callEvent("onXLS",[]);
		this.XMLLoader=new dtmlXMLLoaderObject(this._parseXML,this,true,this.no_cashe);
		this.XMLLoader.waitCall=call||0;
		this.XMLLoader.loadXML(url);
	},
	_parseXML:function(that,a,b,c,obj){
   		that.clearAll();
        var selected="";
        
        if (!obj) obj=that.XMLLoader;
          var atop=obj.getXMLTopNode("tabbar");
          var arows = obj.doXPath("//row",atop);
          var acs=atop.getAttribute("tabstyle");
          if (acs) that.setStyle(acs);
            
            that._hrfmode=atop.getAttribute("hrefmode")||that._hrfmode;
            that._a.margin =parseInt((atop.getAttribute("margin")||that._a.margin),10);
        
            acs=atop.getAttribute("align");
            if (acs)
            	that._s.align  = (acs=="right"||acs=="bottom");
            that._a.offset = parseInt((atop.getAttribute("offset")||that._a.offset),10);

            acs=atop.getAttribute("skinColors");
            if (acs) that.setSkinColors(acs.split(",")[0],acs.split(",")[1]);
            for (var i=0; i<arows.length; i++){
              var atabs = obj.doXPath("./tab",arows[i]);
                for (var j=0; j<atabs.length; j++){
                	
                    var width=atabs[j].getAttribute("width");
                    var name=that._getXMLContent(atabs[j]);
                    var id=atabs[j].getAttribute("id");
                    that.addTab(id,name,width,"",i);
                    if (atabs[j].getAttribute("selected")) selected=id;

                    if (that._hrfmode)
                        that.setContentHref(id,atabs[j].getAttribute("href"));
                    else
                    for (var k=0; k<atabs[j].childNodes.length; k++){
						var cont=atabs[j].childNodes[k];
                        if (cont.tagName=="content"){
							if (cont.getAttribute("id"))
							   that.setContent(id,cont.getAttribute("id"));
							else
    	                        that.setContentHTML(id,that._getXMLContent(cont));
							}
					}
                }
            }
        if (selected) that.setTabActive(selected);
        that.callEvent("onXLE",[]);
    },
    adjustOuterSize:function(){
    	this._setSizes();	
    },
	_getXMLContent:function(node){
       var text="";
       for (var i=0; i<node.childNodes.length; i++)
            {
                var z=node.childNodes[i];
                text+=(z.nodeValue===null?"":z.nodeValue);
            }
       return text;
	},
/**
*     @desc: enable/disable content zone (enabled by default)
*     @type: public
*     @param: mode - true/false
*     @topic: 0
*/
	
	enableContentZone:function(mode){
		this._conZone.style.display=((convertStringToBoolean(mode))?"":"none");
		this._setSizes();
	},
/**
*     @desc: enable/disable force hiding mode, solves IE problems with iframes in HTML content, but can cause problems for other dhtmlx components inside tabs
*     @type: public
*     @param: mode - true/false
*     @topic: 0
*/
	enableForceHiding:function(mode){
    	this._s.hide=convertStringToBoolean(mode);
	},

/**
*     @desc: set control size
*     @type: public
*     @param: width - new width
*     @param: height - new height
*     @topic: 0
*/
	
	setSize:function(x,y){
		this.entBox.style.width=x+"px";
		this.entBox.style.height=y+"px";
		this._setSizes();
	},
/**
*     @desc: allow to set skin specific color, must be used AFTER selecting skin
*     @type: public
*     @param: a_tab - color of activ tab
*     @param: p_tab - color of passive tab
*     @param: c_zone - color of content zone  (optional)
*     @topic: 0
*/
	
	setSkinColors:function(a,b){
		if (a) this._a.tab_color=a;
		if (b) this._a.data_color=b;
		this._conZone.style.backgroundColor=b;
	},
/**
*   @desc: set specific colors for specific tab
*   @param: id - id of tab for which setting will be applied
*   @param: color - tab color
*   @param: color - scolor - color in selected state ( optional)
*   @param: css - css class will be attached to text of tab in question
*   @type: public
*   @topic: 1
*/
	
	setCustomStyle:function(id,color,scolor,style){
		var str="";
		this._c[id]={
			color:(";"+(color?("color:"+color+";"):"")+(style||"")),
			scolor:(";"+(scolor?("color:"+scolor+";"):"")+(style||""))
		};
		if (this._tabs[id])
			this._tabs[id].childNodes[0].style.cssText=((this._tabs[id]==this._lastActive)?this._c[id].scolor:this._c[id].color);
		
	},
/**
*   @desc: set path to image folder ( not affect already created element until their state changes ) 
*   @param: path - path to image folder
*   @type: public
*   @topic: 0
*/
	
	setImagePath:function(url){
		this.imgUrl=url;
	},
	getNext:function(tab,alt){
		alt=alt||"nextSibling";
		var next=tab[alt];
		if (next && next.className.indexOf("dhx_tab_element")==-1) next=null;
		if (!next && tab.parentNode[alt])
			next=tab.parentNode[alt].childNodes[0];
		return next||tab;
	},
/**
*     @desc: select tab next to active
*     @type: public
*     @return: id of current active tab
*     @topic: 0
*/
	
	goToNextTab:function(tab){
		do {tab=this.getNext(tab||this._lastActive)}while (!this._setTabActive(tab));
		return tab;
	},
/**
*     @desc: select tab previous to active
*     @type: public
*     @return: id of current active tab
*     @topic: 0
*/
	
	goToPrevTab:function(tab){
		do {tab=this.getNext((tab||this._lastActive),"previousSibling")}while (!this._setTabActive(tab));
		return tab;
	},
/**
*   @desc: disable tab in tabbar
*   @param: tab - id of tab
*   @param: mode - if set to true, selection jump from current tab to nearest one
*   @type: public
*   @topic: 1
*/
	
	disableTab:function(id){
		this._tabs[id]._disabled=true;
		this._tabs[id].style.color="silver";
	},
/**
*   @desc: enable tab in tabbar
*   @param: tab - id of tab
*   @type: public
*   @topic: 1
*/
	
	enableTab:function(id){
		this._tabs[id]._disabled=false;
		this._tabs[id].style.color="";
	},
/**
*   @desc: show hidden tab in tabbar
*   @param: tab - id of tab
*   @type: public
*   @topic: 1
*/
	
	showTab:function(id){
		var tab=this._tabs[id];
		tab.style.display="";
		this._setTabSizes(tab.parentNode);
	},
/**
*   @desc: hide tab in tabbar
*   @param: tab - id of tab
*   @param: mode - if set to true, selection jump from current tab to nearest one
*   @type: public
*   @topic: 1
*/
	
	hideTab:function(id, mode){
		var tab=this._tabs[id];
		tab.style.display="none";
		if (tab == this._lastActive && mode !== false)
			this.goToNextTab();
		this._setTabSizes(tab.parentNode);
	},
/**
*     @desc: get id of current active tab
*     @type: public
*     @return: id of current active tab
*     @topic: 0
*/
	
	getActiveTab:function(){
		if (!this._lastActive) return null;
		return this._lastActive.getAttribute("tab_id");
	},
/**
*   @desc: set label of tab
*   @param: tab - id of tab
*   @param: value -  new label
*   @type: public
*   @topic: 1
*/
	
	setLabel:function(id,text){
	    var activeTab = this.getActiveTab();
		this._tabs[id].firstChild.innerHTML=text;
		this.adjustTabSize(this._tabs[id]);
		this._setTabSizes(this._tabs[id].parentNode);
		this._checkScroll();
	},
/**
*   @desc: get label of tab
*   @param: tab - id of tab
*   @type: public
*   @topic: 1
*/
	getLabel:function(id){
			return this._tabs[id].firstChild.innerHTML;
	},	
/**
*   @desc:  set offset before first tab on tabbar
*   @param: offset - offset value
*   @type: public
*   @topic: 1
*/
	
	setOffset:function(n){
		this._a.offset=n*1;	
	},
/**
*   @desc: enable/disable scrollers ( enabled by default )
*   @param: mode - true/false
*   @type: public
*   @edition: Professional
*   @topic: 0
*/
	enableScroll:function(mode){
		this._s.scrolls=convertStringToBoolean(mode);
	},
/**
*   @desc:  set distance between tabs
*   @param: margin - margin value
*   @type: public
*   @topic: 1
*/
	
	setMargin:function(n){
		this._a.margin=n*1;	
	},
/**
*   @desc:  set align of tabs on tabbar
*   @param: align - left/right for gorizontal tabbar, top/bottom for vertical tabbar
*   @type: public
*   @topic: 1
*/
	
	setAlign:function(n){
		this._s.align=(n=="bottom"||n=="right");
	},
/**
*     @desc: return window of tab content for iframe based tabbar
*     @type: public
*     @param: tab_id - tab id
*     @topic: 1
*/
    tabWindow:function(tab_id){
    	return (this._content[tab_id]?this._content[tab_id]._frame.contentWindow:null);
    },
/**
*     @desc: set content of tab, as HTML string
*     @type: public
*     @param: id - id of tab
*     @param: html - html string
*     @topic: 1
*/    
	setContentHTML:function(id,value){
		this.cells(id).attachHTMLString(value);
		return this.cells(id);
	},
/**
*     @desc: set content of tab
*     @type: public
*     @param: id - id of tab
*     @param: nodeId - id of container, or container object
*     @topic: 1
*/
	
	setContent:function(id,value){
		this.cells(id).attachObject(value);
		this.cells(id).activate();
	},
/**
*     @desc: set mode of loading external content
*     @type: public
*     @param: mode - href mode - ifram/iframes/ajax
*     @topic: 0
*/
	
	setHrefMode:function(mode){
        this._hrfmode=mode;
    },	
/**
*     @desc: set content as a href to an external file
*     @type: public
*     @param: href - link too external file
*     @topic: 1
*/
    
	setContentHref:function(id,href){
		this._hrefs[id]=href;
		switch (this._hrfmode){
			case "iframes":
				this.cells(id).attachURL(href);	
				break;
			case "iframe":
			case "iframes-on-demand":
				this.cells(id)._delay=["url",href,false];
				break;
			
			case "ajax":
				var cell=this.cells(id);
				var that=this;
				cell._delay=["urlajax",href,true];
				if (!cell.attachHTMLStringA){
					cell.attachHTMLStringA=cell.attachHTMLString;
					cell.attachHTMLString=function(str,xml){
						if (xml) str=that._getXMLContent(xml.doXPath("//content")[0]);
						return this.attachHTMLStringA(str);
					}
				}
				//this.cells._doOnAttachURL();
				break;
			case "ajax-html":
				this.cells(id)._delay=["urlajax",href,true];
				break;
		}
		if (this._tabs[id]==this._lastActive) this.cells(id).show(true);
	},

	showInnerScroll:function(){
		for (var i in this._tabs)
			this.cells(i).dhxcont.mainCont.style.overflow="auto";
	},
	
/** 
* @desc: returns the number of tabs in all rows 
* @type: public 
* @topic: 0 
*/ 
	getNumberOfTabs:function (){ 
		var tc = 0; 
		for(var i=0; i<this._rows.length; i++)
			tc+=this._rows[i].tabCount;
		return tc; 
	},
	
	destructor:function(){
		try{
			console.log("[warning] dhtmlXTabBar destructor needed")
		}catch(e){}
	},
	/**
	 * 设置tabbar头部距离左边长度
	 */
	setTabTitleLeft:function(tabTitleLeft){
		this.tabTitleLeft = tabTitleLeft;
		this._tabZone.style.left=this.tabTitleLeft+"px";
		var width = $(this._tabAll).getWidth();
		this._tabZone.style.width=width-this.tabTitleLeft+"px";
		if(this._lineA)this._lineA.style[this._dx]=$(this._tabAll).getWidth()-this.tabTitleLeft+"px";
		for(var i =0;i<this._rows.length;i++){
			this._rows[i].style.width=width-this.tabTitleLeft+"px";
		}
	},
	resetTabTitleWidth:function(){
		var width = $("middleFrame").getWidth();
		width=width-$(this._tabHome).getWidth();
		this._tabZone.style.left=$(this._tabHome).getWidth()+"px";
		//if(!_isIE||_isIE==8)this._tabZone.style.marginLeft=$(this._tabHome).getWidth()+"px";
		jQuery(this._tabZone).css("width",width+"px");
	},
	/**
	 * 添加带有icon的tab
	 * @author zhangml
	 */
	addIconTab:function(id, text, iconClass,size, position, row){
		if (!this.__skin && dhtmlx.skin) this.setSkin(dhtmlx.skin);
		row=row||0;
		var z=this._rows[row].tabCount;
		if ((!position)&&(position!==0)) position=z;
	
	    var tab=this._createIconTab(id, text, (size=="*"?10:size||this._s._tabSize),iconClass);
		this._addTab(this._rows[row],tab,size||this._s._tabSize,position);
		this._tabs[id]=tab;
		this.cells(id).hide();
		this._checkScroll();
		this.callEvent("onTabAdded",[id]); 
	},
	/**
	 * 新建带有icon的tab
	 * @author zhangml
	 */
	_createIconTab:function(id,text,size, iconClass){
		var tab=document.createElement("DIV");
		tab.className='dhx_tab_element dhx_tab_element_inactive';
		var thml="<span>";
		if (iconClass){
			thml += "<i class=\"" + iconClass + "\"></i>";
		}
		thml+=text+"</span><div></div><div></div><div></div>";
		if (this._close) thml+="<IMG style='"+this._pxc+":4px; "+this._py+":4px;position:absolute;z-index:11;' src='"+this.imgUrl+this.skin+"/close.png' >"
		tab.innerHTML=thml;
		
		tab.setAttribute("tab_id",id);
		tab.setAttribute("tab_title",text);
		isNaN(parseInt(size))?size=0:size;
		tab._size=parseInt(size);
		tab.style[this._dx]=parseInt(size)+"px";
		tab.style[this._dy]=this._s.line_height+this._s.increment+"px";
		tab.style[this._py]=this._a.select_top+"px";
		tab.skin=this.skin;
		if (this._a.tab_color)
			tab.style.backgroundColor=this._a.tab_color;
		if (this._c[id])
	    	tab.childNodes[0].style.cssText=this._c[id].color;
	    	
		this._img_all(tab);
		if (this._close){
			var self=this;
			tab.childNodes[4].onclick=function(e){ var id=this.parentNode.getAttribute("tab_id"); if (self.callEvent("onTabClose",[id])) self.removeTab(id,true); (e||event).cancelBubble=true; };
		}
		return tab;	
	},
	getTab:function(id){
		return this._tabs[id];
	},
	/**
	 * 返回tabbar数组
	 */
	getTabs:function(){
		return Object.values(this._tabs).compact();
	},
	/**
	 * 重写默认的_checkScroll方法
	 */
	_checkScroll:function(){
		if (this._s._vMode || !this._s.scrolls) return; //only x-scrolls
		var tabWidth = 0;
		for (var i in this._tabs){
			tabWidth+=parseInt(this._tabs[i].offsetWidth,10);
		}
		if ((this._rows[0].scrollWidth-this._rows[0].offsetWidth)>2&&this._rows[0].offsetWidth<tabWidth){
			var lastTab =this._rows[0].childNodes[this._rows[0].tabCount-1];
			this._showScroll(0);
		}else {
			this._rows[0].scrollLeft ="0px";
			this._hideScroll(0);
		}
	},
	/**
	 * 显示滚动按钮
	 */
	_showScroll:function(i){
		if (this._rows[i]._scroll) return;
		var a=this._rows[i]._scroll=[];
		var top = Math.max(0,this._s.line_height-23);
		a[0]=document.createElement("DIV");
		a[0].style.cssText="background-image:url("+this.imgUrl+this.skin+"/"+this.skin+"_scroll_left.gif); width:20px; height:21px;position:absolute;left:0px;z-index:990;top:"+top+"px;";
		//a[0].className="dhx_tab_scroll_left";
		Event.observe(a[0],"click",this.scrollToLeft.bind(this));
		this._rows[i].appendChild(a[0]);
		a[1]=document.createElement("DIV");
		a[1].style.cssText="background-image:url("+this.imgUrl+this.skin+"/"+this.skin+"_scroll_right.gif); width:20px; height:21px;position:absolute;right:0px;z-index:990;top:"+top+"px;";
		//a[1].className="dhx_tab_scroll_right";
		Event.observe(a[1],"click",this.scrollToRight.bind(this));
		this._rows[i].appendChild(a[1]);
	},
	/**
	 * 隐藏滚动按钮
	 */
	_hideScroll:function(i){
		if (!this._rows[i]._scroll) return;
		this._rows[i].removeChild(this._rows[i]._scroll[0])
		this._rows[i].removeChild(this._rows[i]._scroll[1])
		this._rows[i]._scroll=null;
	},
	/**
	 * 获得需要滚动的像素
	 */
	getScrollIncrement:function(isLeft,multiple){
		multiple = multiple||1;
		var tabs = this.getTabs();
		var scLeft = this._rows[0].scrollLeft;
		var ofLeft = 0,ofWidth=0;
		var result = 0;
		if(isLeft){
			for(var i=tabs.length-1;i>=0;i--){
				ofLeft=tabs[i].offsetLeft;
				ofWidth=tabs[i].offsetWidth;
				if(scLeft>ofLeft&&scLeft<(ofLeft+ofWidth)){
					result=scLeft-ofLeft+2;
					multiple--;
				}else{
					if(result>0&&multiple>0){
						result+=ofWidth;
						multiple--;
					}
				}
			}
			result = result*-1;
		}else{
			scLeft=scLeft+this._rows[0].offsetWidth;
			for(var i=0;i<tabs.length;i++){
				ofLeft=tabs[i].offsetLeft;
				ofWidth=tabs[i].offsetWidth;
				if(scLeft>ofLeft&&scLeft<(ofLeft+ofWidth)){
					result= ofLeft+ofWidth-scLeft+2;
					multiple--;
				}else{
					if(result>0&&multiple>0){
						result+=ofWidth;
						multiple--;
					}
				}
			}
		}
		return result;
	},
	/**
	 * 向左滚动
	 */
	scrollToLeft:function(){
		this._scrollToPos(true);
	},
	/**
	 * 向右滚动
	 */
	scrollToRight:function(){
		this._scrollToPos(false);
	},
	/**
	 * 向左后者向右滚动multiple个tabbar宽度
	 */
	_scrollToPos:function(isLeft,multiple){
		this.setScrollPos(this.getScrollIncrement(isLeft,multiple),true);
		this._setTabTop(this._lastActive);
	},
	/**
	 * 设置滚动尺寸
	 */
	setScrollPos:function(increment,isAnimation){
		if(isAnimation){
			var inc=0.2,lastPos = (this._rows[0]._scroll[0].parentNode.scrollLeft + increment);
			var scrollInterval = setInterval(
				function(){
					if (inc>=1){
					    clearInterval(scrollInterval);
					    scrollInterval = null;
					    this._rows[0]._scroll[0].parentNode.scrollLeft = lastPos;
					}else{
						this._rows[0]._scroll[0].parentNode.scrollLeft = this._rows[0]._scroll[0].parentNode.scrollLeft + 0.2*increment;
						inc+=0.2;
					}
					this._rows[0]._scroll[0].style.left=this._rows[0].scrollLeft+"px";
					if (!_isIE || window.XMLHttpRequest)
						this._rows[0]._scroll[1].style.right=this._rows[0].scrollLeft*(-1)+"px";
				}.bind(this), 
				100
			);
		}else{
			this._rows[0]._scroll[0].parentNode.scrollLeft = this._rows[0]._scroll[0].parentNode.scrollLeft + increment;
		}
	},
	/**
	 * 重写_scrollTo
	 */
	_scrollTo:function(tab){
		if (!this._s.scrolls) return;
		if (tab.offsetLeft<tab.parentNode.scrollLeft || (tab.offsetLeft+tab.offsetWidth)>(tab.parentNode.scrollLeft+tab.parentNode.offsetWidth)){
			if(tab.offsetLeft<tab.parentNode.scrollLeft){
				this.setScrollPos(tab.offsetLeft-tab.parentNode.scrollLeft,true);
			}else{
				this.setScrollPos((tab.offsetLeft+tab.offsetWidth)-(tab.parentNode.scrollLeft+tab.parentNode.offsetWidth),true);
			}
			var tag = tab.parentNode._scroll;
			if (tag && tag[0]){
				tag[0].style.left=tag[0].parentNode.scrollLeft+"px";
				if (!_isIE || window.XMLHttpRequest)
	    			tag[1].style.right=tag[1].parentNode.scrollLeft*(-1)+"px";
			}
		}
	},
	setTabContentZoneSize : function(size)
	{
		if(!size) return;
		if(size.height) 
		{			
	        if (this._tabZone.childNodes.length)
	            var z=this._tabZone.lastChild.offsetTop-this._tabZone.firstChild.offsetTop+this._height;
	        else
	            var z=this._height+(_isIE?5:0);
			
			this.height = (12+z+parseInt(size.height));				
		}
		if(size.width) 
		{
			this.width = size.width;
		}
		this._setSizes();
	},
	getTabContentZone: function()
	{
		return this._conZone;
	}

}

